@using Abp.Configuration
<div>
    <form name="mySettingsForm" role="form" novalidate class="form-validation">
        <div class="modal-header">
            <h3 class="modal-title">
                <span>@L("MySettings")</span>
            </h3>
        </div>
        <div class="modal-body">

            <div class="form-group form-md-line-input form-md-floating-label no-hint">
                <input class="form-control" type="text" name="Name" ng-class="{'edited':vm.user.name}" ng-model="vm.user.name" required maxlength="@MyCompanyName.AbpZeroTemplate.Authorization.Users.User.MaxNameLength">
                <label>@L("Name")</label>
            </div>

            <div class="form-group form-md-line-input form-md-floating-label no-hint">
                <input type="text" name="Surname" class="form-control" ng-class="{'edited':vm.user.surname}" ng-model="vm.user.surname" required maxlength="@MyCompanyName.AbpZeroTemplate.Authorization.Users.User.MaxSurnameLength">
                <label>@L("Surname")</label>
            </div>

            <div class="form-group form-md-line-input form-md-floating-label no-hint">
                <input type="email" name="EmailAddress" class="form-control" ng-class="{'edited':vm.user.emailAddress}" ng-model="vm.user.emailAddress" required maxlength="@MyCompanyName.AbpZeroTemplate.Authorization.Users.User.MaxEmailAddressLength">
                <label>@L("EmailAddress")</label>
            </div>

            <div class="form-group form-md-line-input form-md-floating-label no-hint">
                <input type="text" name="PhoneNumber" class="form-control" ng-class="{'edited':vm.user.phoneNumber}" ng-model="vm.user.phoneNumber" maxlength="@MyCompanyName.AbpZeroTemplate.Authorization.Users.User.MaxPhoneNumberLength">
                <label>@L("PhoneNumber")</label>
            </div>

            <div class="form-group form-md-line-input form-md-floating-label">
                <input type="text" ng-disabled="!vm.canChangeUserName" ng-class="{'edited':vm.user.userName}" name="UserName" class="form-control" ng-model="vm.user.userName" required maxlength="@MyCompanyName.AbpZeroTemplate.Authorization.Users.User.MaxUserNameLength">
                <label>@L("UserName")</label>
                <span class="help-block" ng-show="!vm.canChangeUserName">@L("CanNotChangeAdminUserName")</span>
            </div>

            <div class="form-group form-md-line-input form-md-floating-label has-info" ng-if="vm.showTimezoneSelection">
                <timezone-combo selected-timezone="vm.user.timezone" default-timezone-scope="@((int)SettingScopes.User)"></timezone-combo>
                <label>@L("Timezone")</label>
            </div>

        </div>
        <div class="modal-footer">
            <button type="button" ng-disabled="vm.saving" class="btn btn-default" ng-click="vm.cancel()">@L("Cancel")</button>
            <button type="submit" button-busy="vm.saving" busy-text="@L("SavingWithThreeDot")" class="btn btn-primary blue" ng-click="vm.save()" ng-disabled="mySettingsForm.$invalid"><i class="fa fa-save"></i> <span>@L("Save")</span></button>
        </div>
    </form>
</div>